
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="ico/logo.ico" type="image/x-icon" />
    <title>协同办公--用户注册</title>
    <link rel="stylesheet" href="../static/css/bootstrap.css">
    <link rel="stylesheet" href="../static/js/layui/css/layui.css">
    <link rel="stylesheet" href="../static/css/font.css">
    <style>
html{
    height: 100%;
    margin: auto;
}
body{
    height: 100%;
    background-image:url("../static/imaegs/011.png");
    margin: auto;
}
        #boxes>div{
            margin-left: 5%;
        }
        #left>a{
            margin-top:30px;
            margin-left: 20px;
        }
        #logo{
            margin-top: 20px;
            margin-left: 10%;
            height: 80px;
            display: flex;
            flex-direction: row;

        }
        #tiao{
            width: 100%;
            height: 50px;
            background-image: url("../static/imaegs/breadbg.gif");
            display: flex;
            flex-direction: row;
        }
        #right{
            margin-top: 10px;
            margin-left: 50%;

        }
        #from_block{
            width: 100%;
            margin-left: 10%;
            margin-top: 20px;
            height: 300px;
            padding-top: 20px;

        }
        #left{
            margin-left: 10%;
            margin-top: 10px;
        }
#title{
    width: 150px;
}
#from-right,#from-left{
    width: 400px;
    display: flex;
    flex-direction: column;
}
        form{
            display: flex;
            flex-direction: row;
        }
        i{
            font-size: 30px;
        }
        #footer{
            width: 100%;
            height: 100px;
            position: fixed;
           bottom: 0;
            text-align: center;

        }
        #fot-word{
            font-size: 9px;
            color: grey;
        }
        #hua1{
          width: 150px;
            position: absolute;
            float: left;
            bottom: 0;
        }
    </style>
</head>
<body>
<img id="hua1" src="../static/imaegs/hau.png">
<div id="logo"><div id="logo-img"><img src="../static/imaegs/logo/logo2.png"></div></div>
<div id="tiao">
    <div id="left"><a href="https://wangjibu.top"><i class="layui-icon" style="font-size: 20px; color: #1E9FFF;">&#xe68e;</i>&nbsp;首页</a><a href="loginU.html"><i class="layui-icon" style="font-size: 20px; color: #1E9FFF;">&#xe770;</i>&nbsp;登录页面</a></div>
    <div id="right"><a style="color:grey">有账号?&nbsp;</a><a href="login.html">立即登陆</a></div>
</div>
<div id="from_block">
    <form method="post" >
        <div id="from-left">
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" ><i class="iconfont" style="color: #0b3b8c">&#xe6b8;</i>账号：</label>
            <div class="layui-input-inline login-inline">
                <input type="text" name="username" id="username" lay-verify="required" placeholder="请输入你的帐号" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" ><i class="iconfont" style="color: #0b3b8c">&#xe82b;</i>密码：</label>
            <div class="layui-input-inline login-inline">
                <input type="password" name="password" id="password"  lay-verify="required" placeholder="请输入你的密码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" ><i class="iconfont" style="color: #0b3b8c">&#xe82b;</i>验证密码：</label>
            <div class="layui-input-inline login-inline">
                <input type="password" name="chack_psd" id="chack_psd"  lay-verify="required" placeholder="请再次输入你的密码" autocomplete="off" class="layui-input">
            </div>
        </div></div>
        <div id="from-right">
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" ><i class="iconfont" style="color: #0b3b8c">&#xe6b2;</i>邀 请 码：</label>
            <div class="layui-input-inline login-inline">
                <input type="text" name="code" id="code"  lay-verify="required" placeholder="请输入你的邀请码" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" ><i class="iconfont" style="color: #0b3b8c">&#xe6b2;</i>团队名称：</label>
            <div class="layui-input-inline login-inline">
                <input type="text" name="class_name" id="class_name"  lay-verify="required" placeholder="请输入你的团队名称" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label login-form" id="title" >QQemail:</label>
            <div class="layui-input-inline login-inline">
                <input type="email" name="email" id="email"  lay-verify="required" placeholder="请输入你的qq邮箱" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="form-actions">
            <button class="btn btn-warning " lay-submit lay-filter="login" style="margin-left: 60%" onclick="login()" type="button">注&nbsp;&nbsp;册</button>
        </div>
        </div>
    </form>
</div>
<hr>
<br>
<div id="footer">
    <hr>
    <a id="fot-word">
        版权信息：xianghai保留所有权利，请尊重他人的劳动成果   ||    备案号：蜀ICP备18021117号
        ||           地址：四川省成都市高新区天一街83号软件大楼
    </a>
</div>
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/layui/layui.all.js"></script>
<script>


    function login() {

        var user_name = $('input[name="username"]'),
            user_pwd = $('input[name="password"]'),
            chack = $('input[name="chack_psd"]'),
        class_name=$('input[name="class_name"]'),
        code=$('input[name="code"]'),
        email=$('input[name="email"]');

        var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
        if (user_name.val() === '') {
            layer.msg('你的账号还未填写');
            return false;
        }
        if (user_pwd.val() === '') {
            layer.msg('你的密码还未填写');
            return false;
        }

        else if (chack.val() !== user_pwd.val()) {
            layer.msg("您两次输入的密码不一致，请重新输入");
            return false;

        }
        else if(code.val()===""){

            layer.msg('你的邀请码为空');
            return false;
        }
        else if(class_name.val()===""){

            layer.msg('你的团队名称为空');
            return false;
        }
        else if(email.val()==="") {

            layer.msg('你的邮箱还没有填');
            return false;
        }
        else if(!reg.test(email.val())){
            layer.msg("邮箱格式出错了！");
            return false;
        }

        else {
            $user = user_name.val();
            $pass = user_pwd.val();
            $className=class_name.val();
            $code=code.val();
            $email=email.val();
            $.ajax({
                type: 'post',
                cache: 'false',
                url: '../php/user/user_add.php',
                data: {
                    "user": $user,
                    "pass": $pass,
                    "className":$className,
                    "code":$code,
                    "email":$email,
                },
                dataType: 'Json',
                success: function (dat) {
                    layer.msg(dat.message);
                    if(dat.message==="恭喜你，注册成功,") {
                        var time = setInterval(showTime, 1000);
                        var second = 0;

                        function showTime() {
                            if (second == 0) {
                                window.location.href = "loginU.html";
                                clearInterval(time);

                            }
                            layer.msg("即将跳转页面" + second + "秒");
                            second--;
                        }
                    }
                },
                error: function (dat) {
                    layer.msg("注册失败，请检查网络是否正常");
                }


            })


        }
    }


</script>
</body>
</html>